<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<p>
  参考: https://juejin.cn/post/7171836076246433799
</p>
<input type="file" id="file">
<script>
  const maxMessageSize = 1024;

  async function readFileData(file) {
    let offset = 0;
    let buffer = null;
    const chunkSize = maxMessageSize;

    while(offset < file.size) {
      const slice = file.slice(offset, offset + chunkSize);
      buffer = await slice.arrayBuffer();
      if (dcFile.bufferedAmount > 65535) {
        // 等待缓存队列降到阈值之下
        await new Promise(resolve => {
          dcFile.onbufferedamountlow = (ev) => {
            log("bufferedamountlow event! bufferedAmount: " + dcFile.bufferedAmount);
            resolve(0);
          }
        });
      }

      // 可以发送数据了
      dcFile.send(buffer);
      offset += buffer.byteLength;
      sendProgress.value = offset;

      // 更新发送速率
      const interval = (new Date()).getTime() - lastReadTime;
      bitrateSpan.textContent = `${Math.round(chunkSize * 8 / interval )}kbps`;
      lastReadTime = (new Date()).getTime();
    }
  }

  document.getElementById('file').addEventListener('change', (e) => {
    console.log(e.target.files[0])
  })
</script>
</body>
</html>
